<template>
  <div v-loading="loading">
    <a-alert message="此配置用于快速上传发布小程序" type="info" show-icon style="margin: 10px 0 20px 15px" />
    <a-form-model
      ref="wechatForm"
      :rules="wechatRules"
      :model="wechatInfo"
      :labelCol="{ span: 3 }"
      :wrapperCol="{ span: 12 }"
    >
      <a-form-model-item label="三方平台Appid" prop="platform_third_appid">
        <a-input v-model="wechatInfo.platform_third_appid" type="text" />
      </a-form-model-item>
      <a-form-model-item label="三方平台AppSecret" prop="platform_third_secret">
        <a-input v-model="wechatInfo.platform_third_secret" type="text" />
      </a-form-model-item>
      <a-form-model-item label="三方平台小程序AppId" prop="platform_wechat_third_appid">
        <a-input v-model="wechatInfo.platform_wechat_third_appid" type="text" />
      </a-form-model-item>
      <a-form-model-item label="微信小程序模板" prop="platform_template_id">
        <a-select v-model="wechatInfo.platform_template_id">
          <a-select-option :value="item.template_id" v-for="(item, index) in templateList" :key="index">
            {{ item.user_desc }}
          </a-select-option>
        </a-select>
      </a-form-model-item>
      <a-form-model-item label="平台Token" prop="platform_token">
        <a-input v-model="wechatInfo.platform_token" type="text" />
      </a-form-model-item>
      <a-form-model-item label="平台加解密key" prop="platform_encodingAesKey">
        <a-input v-model="wechatInfo.platform_encodingAesKey" type="text" />
      </a-form-model-item>
      <a-form-model-item label="平台手机号" prop="platform_phone">
        <a-input v-model="wechatInfo.platform_phone" type="text" />
      </a-form-model-item>
      <a-form-model-item :wrapper-col="{ span: 24 }">
        <a-divider style="margin: 0 0 40px 0" />
        <div style="display: flex; justify-content: center">
          <a-button :loading="btnLoading" type="primary" @click="submitForm" style="margin-right: 8px"> 保存 </a-button>
          <a-button @click="$router.back()"> 取消 </a-button>
        </div>
      </a-form-model-item>
    </a-form-model>
  </div>
</template>

<script>
import { getPlatformWechatThirdSetting, setPlatformWechatThirdSetting } from '@/api/saas/setting'
import { templateList } from '@/api/setting/applet'

export default {
  name: 'SaasSettingWechatPay',
  data() {
    return {
      loading: false,
      btnLoading: false,
      wechatInfo: {
        platform_template_id: '',
        platform_token: '',
        platform_encodingAesKey: '',
        platform_phone: '',
        platform_third_appid: '',
        platform_third_secret: '',
        platform_wechat_third_appid: ''
      },
      wechatRules: {
        platform_token: [{ required: true, message: '请输入平台Token', trigger: 'blur' }],
        platform_encodingAesKey: [{ required: true, message: '请输入平台加解密Key', trigger: 'blur' }],
        platform_phone: [{ required: true, message: '请输入平台手机号', trigger: 'blur' }],
        platform_third_appid: [{ required: true, message: '请输入三方平台Appid', trigger: 'blur' }],
        platform_third_secret: [{ required: true, message: '请输入三方平台AppSecret', trigger: 'blur' }],
      },
      // 微信模板列表
      templateList: [],
    }
  },
  created() {
    this.getData()
    this.getTemplateList()
  },
  methods: {
    getData: function () {
      this.loading = true
      getPlatformWechatThirdSetting({})
        .then((res) => {
          if (res.code == 0) {
            this.wechatInfo = res.data
          }
        })
        .catch((error) => {
          console.log(error)
        })
        .then(() => {
          this.loading = false
        })
    },
    submitForm: function () {
      this.$refs.wechatForm.validate((valid) => {
        if (valid) {
          this.btnLoading = true
          setPlatformWechatThirdSetting(this.wechatInfo)
            .then((res) => {
              if (res.code == 0) {
                this.$message.success('保存成功！')
              } else {
                this.$message.warning(res.msg ? res.msg : '保存失败！')
              }
            })
            .catch((error) => {
              console.log(error)
            })
            .then(() => {
              this.btnLoading = false
            })
        }
      })
    },
    // 获取微信模板列表
    async getTemplateList() {
      const res = await templateList()
      if (res.code == 0) {
        this.templateList = res.data.template_list
      }
    },
  },
}
</script>

<style scoped>
</style>
